import styles from './styles.module.scss'
import FootBall from '../../football/scorelist/index'
import dayjs from 'dayjs'
import Link from 'next/link'


// 全场 上半场 + 下半场 + 加时
const Pannier = ({ data, value }) => {
  const item = Reflect.get(FootBall.status, value)
  const winAndLose = (row, str, num) => {
    // num 0 主数据  1客数据
    const state = str === 'eu' ? row?.index?.[str]?.company : row?.index?.[str]
    if (!state) return '-'
    let currentData = state?.find(row => row?.company === '365') // 优先取365
    if (!currentData) currentData = state?.[0]
    if (currentData?.inGame?.length > 0) return currentData?.inGame?.[num]
    return currentData?.last?.[num]
  }

  const halfNum = (row) => {
    //半场分差
    const a = row?.homeTeamScore[0] + row?.homeTeamScore[1]
    const b = row?.awayTeamScore[0] + row?.awayTeamScore[1]
    return b - a
  }



  const halfSum = (row) => {
    //半场总分
    const a = row?.homeTeamScore[0] + row?.homeTeamScore[1]
    const b = row?.awayTeamScore[0] + row?.awayTeamScore[1]
    return a + b
  }
  const Block = ({ row }) => {
    const sum = (data) => data?.reduce((sum, value) => sum += value, 0)
    return (
      <div className={styles.pannier}>
        <div>
          <span>
            <i>{dayjs(row?.matchTime * 1000).format("HH:mm")}</i>
            <i>{row?.eventName}</i>
          </span>
          <span>
            {
              row?.homeTeamScore?.map((row, i) => (
                <i key={i}>{i + 1}</i>
              ))
            }
          </span>
          <span>上下</span>
          <span>全场</span>
          <span>分差</span>
          <span>总分</span>
          <span>胜负</span>
          <span>让分</span>
          <span>总分</span>
          <span>数据中心</span>
        </div>
        <div>
          <span>
            <i></i>
            <i>{row?.homeTeamName}</i>
          </span>
          <span className={styles.scoreNum}>
            {
              row?.homeTeamScore?.map((row, i) => (
                <i key={i}>{row || '-'}</i>
              ))
            }
          </span>
          <span>
            {
              (() => {
                const item = (i, k) => row?.homeTeamScore[i] + row?.homeTeamScore[k]
                return (item(0, 1) || '-') + '/' + (item(2, 3) || "-")
              })()
            }
          </span>
          <span style={{ color: "red", }}>
            {
              sum(row?.homeTeamScore) || '-'
            }
          </span>
          <span>
            全:{
              sum(row?.awayTeamScore) - sum(row?.homeTeamScore) || '-'
            }
          </span>
          <span>
            全:
            {
              (sum(row?.awayTeamScore) + sum(row?.homeTeamScore)) || '-'
            }
          </span>
          <span>
            {
              winAndLose(row, 'eu', 0) || '-'
            }
          </span>
          <span>
            <i style={{ color: "red", marginRight: 10 }}>
              {winAndLose(row, 'asia', 1) || '-'}
            </i>
            <i>
              {winAndLose(row, 'asia', 0) || '-'}
            </i>
          </span>
          <span>
            <i style={{ color: "red", marginRight: 10 }}>
              {winAndLose(row, 'bs', 1) || '-'}
            </i>
            <i>
              {winAndLose(row, 'bs', 0) || '-'}
            </i>
          </span>
          <Link href={`/score/analysis/2/${row?.id}`}>
            <a style={{ cursor: "pointer" }}>分析</a>
          </Link>
        </div>





        <div>
          <span>
            <i></i>
            <i>{row?.awayTeamName}</i>
          </span>
          <span className={styles.scoreNum}>
            {
              row?.awayTeamScore.map((row, i) => (
                <i key={i}>{row || '-'}</i>
              ))
            }
          </span>
          <span>
            {
              (() => {
                const item = (i, k) => row?.awayTeamScore[i] + row?.awayTeamScore[k]
                return (item(0, 1) || '-') + '/' + (item(2, 3) || '-')
              })()
            }
          </span>
          <span style={{ color: "red", }}>
            {

              sum(row?.awayTeamScore) || '-'
            }
          </span>
          <span>
            半:{
              halfNum(row) || '-'
            }
          </span>
          <span>
            半:
            {
              halfSum(row) || '-'
            }
          </span>
          <span>
            {
              winAndLose(row, 'eu', 1) || '-'
            }
          </span>
          <span>
            <i style={{ color: "red", marginRight: 10 }}>
              {winAndLose(row, 'asia', 1) || '-'}
            </i>
            <i>
              {winAndLose(row, 'asia', 2) || '-'}
            </i>
          </span>
          <span>
            <i style={{ color: "red", marginRight: 10 }}>
              {winAndLose(row, 'bs', 1) || '-'}
            </i>
            <i>
              {winAndLose(row, 'bs', 2) || '-'}
            </i>
          </span>
          <Link href={`/score/analysis/2/${row?.id}`}>
            <a style={{ cursor: "pointer" }}>分析</a>
          </Link>
        </div>
      </div>
    )
  }


  return (
    <>
      {
        Reflect.get(data, value)?.map(row => (
          <Block row={row} key={row?.id}></Block>
        ))
      }
    </>
  )
}





const Scorelist = ({ data }) => {
  console.log(FootBall.status)
  return (
    <section>
      {
        Object.keys(FootBall.status).map(row => (
          <>
            <FootBall.ScoreState state={row} data={data}></FootBall.ScoreState>
            <Pannier data={data} value={row} key={row}></Pannier>
          </>
        ))
      }
    </section>
  )
}

export default Scorelist